<template>
  <div>
    <p>
      <router-link to="/homeWork2" tag="span">返回</router-link>
      <b>{{ id }}</b>
      <router-link to="/homeWork2" tag="i">切换城市</router-link>
    </p>
    <form action="">
      <input type="text" placeholder="输入学校、商务楼、地址" />
      <button>提交</button>
    </form>
  </div>
</template>
<script>
export default {
  data() {
    return {
      id: "",
    };
  },
  mounted() {
    this.id = this.$route.query.biao;
  },
};
</script>

<style scoped>
* {
  margin: 0;
  padding: 0;
}
p {
  width: 100%;
  align-items: center;
  display: flex;
  justify-content: space-between;
  height: 50px;
  background: blue;
}
i {
  font-style: normal;
}
b {
  font-size: 30px;
  color: #fff;
}
form {
  background: #ccc;
  width: 100%;
  height: 100px;
  display: flex;
  justify-content: center;
  position: relative;
}
input {
  margin-top: 10px;
  display: block;
  width: 80%;
  border: 1px solid #000;
  height: 40px;
  padding-left: 40px;
  outline: none;
  box-sizing: border-box;
}
button {
  bottom: 10px;
  outline: none;
  border: none;
  width: 80%;
  background: lightblue;
  color: #fff;
  height: 30px;
  position: absolute;
}
</style>